<template>
<h1>El-开关组件</h1>
  <el-switch v-model="value1" />
  <el-switch v-model="value2" class="ml-2"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"/>
  <el-switch v-model="value2" class="ml-2"
      style="--el-switch-on-color: #0aa1ed;"/>
  是否为管理员<el-switch v-model="isAdmin"></el-switch>
  是否显示<el-switch v-model="isShow"></el-switch>
  <img src="fcq.jpg" v-if="isShow" width="200px">
  <el-switch v-model="num" :active-value="1" :inactive-value="0"></el-switch>
  <el-switch v-model="numStr" :active-value="'1'" :inactive-value="'0'"></el-switch>
</template>

<script setup>
import { ref } from 'vue'

const num=ref(1);
const numStr=ref('1');
const value1 = ref(true);
const value2 = ref(true);
const isAdmin=ref(false);
const isShow=ref(false);
</script>

<style scoped>

</style>